<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML>
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<link href="assets/ico/bioroad-logo.ico" rel="shortcut icon">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/bootstrap-dropdown.js"></script>

<style type="text/css">
body {
	background-image: url("images/bghead.jpg");
	background-repeat: repeat-x;
	background-color: #D7E7F7;
}

#container {
	margin-top: 45px;
	margin-left: 20%;
	margin-right: 20%;
	line-height: 74px;
}

.texttitle {
	width: 140px;
	text-align: right;
}

form {
	font-size: 16px;
	margin-left: 18.0%;
	margin-right: 13%;
}

strong {
	padding-right: 0px;
}

li {
	list-style-type: none;
}

#submitBtn {
	margin-left: 35%;
}

#titleId {
	margin-left: 35%;
	margin-top: 120px;
	line-height: 27px;
}

hr {
	color: #999;
}
img{
	margin-bottom: -7px;
}

</style>
<%--<script type="text/javascript">
	function refresh(obj) {
		obj.src = "imageServlet" ;
	}
</script>


--%>
</head>
<body>
	<%@ include file="include/topbar.jsp"%>
	<div
		style="margin-top: -40px;margin-left: 45%;position: absolute;color: #cc0000;display: none;">用户名或密码错误</div>
	<h3 id="titleId">欢迎您使用xxx管理系统</h3>
	<form action="index.action" method="post">
		<div id="container">
			<div style="display: none">用户名或密码错误</div>

			<div>
				<ul>
					<li>
						<div style="height: 37px;">
							<span class="texttitle">用户名</span> <input id="sysusername"
								class="mytext" type="text" name="sysuser.username"
								onclick="onClickforUsername()" onBlur="onBlurforusername()" />
							<span id="prompname"
								style="display:none;color: red;font-size: 12px;">请输入用户名！</span><br />
						</div>
					</li>

					<li><span class="texttitle">密&nbsp;&nbsp;&nbsp;码</span> <input
						id="syspassword" class="mytext" type="password"
						onclick="onClickforPassword()" name="sysuser.password"
						onblur="onBlurforpassword()" /> <span id="promppassword"
						style="display:none;color: red;font-size: 12px;">请输入密码！</span><br />
					</li>

					<li><span class="texttitle">输入验证码&nbsp;&nbsp;&nbsp;</span><img title="点击更换"
						onclick="javascript:refresh(this);" src="image.action"><span style="font-size:12px;color: #999;">点击图片更换</span><br />
						<br/><input id="xxx" type="text"
						name="verifyCode" onblur="toVerfyCode()" />
					</li>
				</ul>
				<span>${houtaiCode}</span>
			</div>
		</div>
	</form>
	<input id="submitBtn" type="submit" class="btn btn-success btn-large"
		value="登录系统" /><a href="#">忘记密码？</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
	<span id="tishi" style="display: none; color: red">您输入的用户名或密码有误</span>
	<hr />
	<a class="registed" href="registed.action"
		style="margin-left: 42%;font-size: 12px;">免费注册新查询账户</a>
</body>
<script type="text/javascript">
	function onBlurforpassword() {
	}
	/*function toVerfyCode(){
		alert($("input[name='randomCode']"));
		window.location.href="toVerifyCode.action?clientInputVerifyCode="+$("input[name='randomCode']");
	}*/

	function refresh(obj) {
		//alert(obj);
		obj.src = "image.action?unUsedData=" + Math.random();
	}
	function onBlurforusername() {
		var name = $("#sysusername").val();
		if (name == "") {
			$("#prompname").show();
		}
		if (name != "") {
			$("#prompname").hide();
		}
	};
	function onClickforUsername() {
		$("#prompname").hide();
		$("#tishi").hide();
	}
	function onClickforPassword() {
		$("#promppassword").hide();
		$("#tishi").hide();
	}
	function onBlurforpassword() {
		if ($("#syspassword").val() == "") {
			$("#promppassword").show();
		}
		if ($("#syspassword").val() != "") {
			$("#promppassword").hide();
		}
	}

	$("#submitBtn").click(function() {
		//form.submit();
		//$.post("",{"search.action":$(this.attr("rel"))});
		login();

	});
	function login() {
		//alert($("#xxx").val());
		$.post("verifyUser.action", {
			"sysuser.username" : $("#sysusername").val(),
			"sysuser.password" : $("#syspassword").val(),
			"verifyCode" : $("#xxx").val()
		}, function(data) {
			if (data) {
				//toTransEmail();
				$("form").submit();
			} else {
				$("#tishi").show();
			}
		});
	}
	$(function(){
		$("input[name='sysuser.username]").focus(function(){
			$("#prompname").hide();
			$("#tishi").hide();
		});
		$("input[name='sysuser.password']").focus(function(){
			$("#promppassword").hide();
			$("#tishi").hide();
		});
	});
	function toTransEmail(){
		window.location.href="transEmail.action";
	}
	$("input[name='sysuser.username']").focus();
</script>
</html>
